<template>
  <ul class="list">
    <li v-for="item in list" :key="item.id">
      <a href="#">
        <img :src="'https://images.weserv.nl?url=' + item.images.small" />
        <div class="info">
          <h3>{{ item.title }}</h3>
          <p>豆瓣评分：{{ item.rating.average }}</p>
          <p>
            <span v-for="(item, i) in item.genres" :key="i" class="tag">{{
              item
            }}</span>
          </p>
        </div>
      </a>
    </li>
  </ul>
</template>

<script>
import { mapState, mapActions } from "vuex";
export default {
  created() {
    this.getListData("coming_soon");
    // this.$store.dispatch('getListData')
  },
  computed: {
    ...mapState(["list"])
  },
  methods: {
    ...mapActions(["getListData"])
  }
};
</script>

<style scoped></style>
